<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!--edge浏览器H5兼容设置-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--360浏览器H5兼容设置-->
    <meta name="renderer" content="webkit" />
    <title>信息添加</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--导入核心文件-->
    <script src="../bootstrap3/js/holder.js"></script>
    <link href="../bootstrap3/css/bootstrap.css" rel="stylesheet" type="text/css">
    <script src="../bootstrap3/jquery-1.9.1.min.js"></script>
    <script src="../bootstrap3/js/bootstrap.js"></script>
    <!-- 字体图标 -->
    <link rel="stylesheet" href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />

    <script src="../bootstrap3/js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>


    <link rel="stylesheet" type="text/css" href="../css/insert.css"/>

</head>
<body>
<!--网页最上方的留白-->
<header>
    <!-- class.container 容器定位 的作用是进行居中布局 -->
    <div class="container">
        <!-- pull-right 向右对齐  -->
        <span class="pull-right"><small>Sports  Equipment</small> <b>Management</b>System</span>
    </div>
</header>

<!--网页 导航栏 在layout.css 文件中设置背景图片-->
<nav>
    <!-- class.container 容器定位 用于设置内容居中 -->
    <div class="container">
        <h1>
            <b>体育器材管理系统</b> <small>——Design by Z</small>
        </h1>

        <!--导航栏-->
        <div>
            <!-- class="nav navbar-nav" 定义导航条 -->
            <ul class="nav navbar-nav">
                <li><a href="home.html">首页</a></li>
                <li><a id="allequ">历史器材表</a></li>
                <li><a id="allemp" >员工表</a></li>


            </ul>
            <!-- class="nav navbar-nav" 定义导航条 向右侧浮动 -->
            <ul class="nav navbar-nav navbar-right">
                <!-- 导航条中的文字使用 class="navbar-text" 样式 -->
                <li><span class="navbar-text"></span></li>
                <li><a id="loginout"><span class="glyphicon glyphicon-off" aria-hidden="true"></span></a></li>
            </ul>
        </div>
        <!-- /导航栏 -->
    </div>
</nav>
<!--主体-->
<br>
<section>
    <div class="container">
        <div class="row" >

            <div id="form1" class="alert alert-danger"  role="alert">
                Excel文件名规定为“器材表”，文件格式为".xls"或".xlsx"
                <form class="form-inline" id="form-equ"  method="post" enctype="multipart/form-data" class="form-horizontal" role="form">
                    <div class="form-group">
                        <input id="file1" type="file"  name="file" style="border: 2px solid;border-radius: 5px">
                    </div>
                    <div class="form-group">
                        <input id="btn-submit" type="button" value="上传器材表" />
                        <input id="btn-addEqu" type="button" value="添加器材" />
                    </div>
                </form>
            </div>

            <div id="form2" class="alert alert-info"  role="alert">
                Excel文件名规定为“员工表”，文件格式为".xls"或".xlsx"
                <form class="form-inline" id="form-equ2"  method="post" enctype="multipart/form-data" class="form-horizontal" role="form">
                    <div class="form-group">
                        <input type="file" id="file2" name="file" style="border: 2px solid;border-radius: 5px">
                    </div>
                    <div class="form-group">
                        <input id="btn-submit2" type="button" value="上传" />
                        <input id="btn-addEmp" type="button" value="添加员工" />
                    </div>
                </form>
            </div>


        </div>
    </div>

    <!--列表显示-->
    <div class="container">
        <div class="row">
            <div class="col-md-2"></div>
            <div class="col-md-10">
                <div id="table-container" style="width: 800px;height:300px;">
                    <table class="table-hover">
                        <caption id="caption">录取器材记录</caption>
                        <thead>
                        <tr>
                            <th><div>记录编号</div></th>
                            <th><div>器材名</div></th>
                            <th><div>器材数量</div></th>
                            <th><div>计量单位</div></th>
                            <th><div>器材价格</div></th>
                            <th><div>器材供应商</div></th>
                            <th><div>供应商电话</div></th>
                            <th><div>供应商地址</div></th>
                            <th><div>供应商邮箱</div></th>
                            <th><div>操作</div></th>
                        </tr>

                        </thead>
                        <tbody id="list">
                        <tr>
                            <td><div id="id1"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input  class="update" value="修改" id="btn1"></td>

                        </tr>
                        <tr>
                            <td><div id="id2"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn2"></td>

                        </tr> <tr>
                            <td><div id="id3"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn3"></td>

                        </tr> <tr>
                            <td><div id="id4"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn4"></td>

                        </tr> <tr>
                            <td><div id="id5"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn5"></td>

                        </tr> <tr>
                            <td><div id="id6"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn6"></td>

                        </tr> <tr>
                            <td><div id="id7"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn7"></td>

                        </tr> <tr>
                            <td><div id="id8"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn8"></td>

                        </tr>
                        <tr>
                            <td><div id="id9"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update"  value="修改" id="btn9"></td>

                        </tr>
                        <tr>
                            <td><div id="id10"></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><div></div></td>
                            <td><input class="update" value="修改" id="btn10"></td>

                        </tr>
                        </tbody>
                    </table>
                </div>
                <br>
            </div>

        </div>
        <div class="row">
            <div class="col-md-2"></div>
            <div class="col-md-10">
                <div id="btn-container" style="align-content: center">
                    <input id="pageup" type="button" value="上一页">
                    <span id="page">1</span>
                    <input id="pagedpwn" type="button" value="下一页">
                </div>
            </div>

        </div>
    </div>


</section>

<!--页脚开始-->
<!--网页底部， class.well 用于设置背景效果-->
<footer class="well">
    <!-- class.container 的作用是进行居中布局 -->
    <div class="container">
        <b>Copyright © 2020 ？？.com All Rights Reserved
            <a href="#">啥也不是</a>
            版权所有
        </b> <span class="pull-right"> <b>Version</b> 1.1.0
      </span>
    </div>
</footer>
<!--页脚结束-->
<script type="text/javascript">
    /*员工表上传*/
    $("#btn-submit2").click(function() {
        var r=confirm("请确认文件命名是否符合规定要求")
        if (r){
            $.ajax({
                "url":"/users/uploademp",
                "data":new FormData($("#form-equ2")[0]),
                "contentType":false,
                "processData":false,
                "type":"post",
                "dataType":"json",
                "success":function(json) {
                    if (json.state == 4000) {
                        // 提示
                        alert("上传成功！");
                        window.location.href="/web/register.html"
                    }
                },
                "error":function(xhr) {
                    alert("\n\nHTTP响应码：" + xhr.status+"请联系管理员");
                    // location.href = "login.html";
                }
            });
        }else{
            $("#file2").val("")
        }

    });
    /*Excel上传按钮*/
    $("#btn-submit").click(function() {

        var r=confirm("请确认文件命名是否符合规定要求")
        if (r) {
            $.ajax({
                "url": "/equ/uploadequ",
                "data": new FormData($("#form-equ")[0]),
                "contentType": false,
                "processData": false,
                "type": "post",
                "dataType": "json",
                "success": function (json) {
                    if (json.state == 2000) {
                        // 提示
                        alert("上传成功！");
                        showEquHistory(pagenumber);
                    }
                },
                "error": function (xhr) {
                    alert("\n\nHTTP响应码：" + xhr.status);
                    // location.href = "login.html";
                }
            });
        }else{
            $("#file1").val("")
        }
    });


    $("#loginout").bind('click',function () {
        $.ajax({
            "url":"/users/logininfo",
            "type":"get",
            "dataType":"json",
            success:function (json) {
                if(json.state==2000){
                    window.location.href="login.html"
                }
            },
            "error":function () {

                $(".navbar-text").append($('<a href="' +'http://localhost:8080/web/login.html'+ '">'+"登录"+'</a>'))

            }
        })
    });

    var pagenumber=0;
    /*上一页*/
    $("#pageup").click(function () {
        console.log("当前页码"+$("#page").text())
        $("#page").text($("#page").text()*1-1)
        console.log("当前页码"+$("#page").text())

        showEquHistory(($("#page").text()*1-1)*10)

    })
    /*下一页*/
    $("#pagedpwn").click(function () {


        $("#page").text($("#page").text()*1+1)

        showEquHistory(($("#page").text()*1-1)*10)
    })


    /*打开网页时，显示器材表*/
    $(document).ready(function () {

        if ($("#page").text()*1==1){
            $("#pageup").attr("disabled",true)
        }

        showEquHistory(0)

        $("#id").attr("disabled",true)

        $("#empname").attr("disabled",true)

        $("#ename").attr("disabled",true)
        $.ajax({
            "url":"/users/loginnum",
            "type":"get",
            "dataType":"json",
            success:function (json) {
                console.log(json.data)
                if (json.data!=null){
                    $("input").removeAttr("disabled")
                    $(".navbar-text").text("管理员："+json.data)
                }
            },
            "error":function () {
                $("input").attr("disabled",true)
                $("#ul").prepend($('<li><a href="' +'http://localhost:8080/web/login.html'+ '">'+"登录"+'</a></li>'))
                $(".navbar-text").text(" ")
            }
        })
    })


    function showEquHistory(pagenumber){
        console.log("正在加载.........");
        for (let i=0;i<10;i++){
            $("#list").children().eq(i).children().children().eq(0).text("")
            $("#list").children().eq(i).children().children().eq(1).text("")
            $("#list").children().eq(i).children().children().eq(2).text("")
            $("#list").children().eq(i).children().children().eq(3).text("")
            $("#list").children().eq(i).children().children().eq(4).text("")
            $("#list").children().eq(i).children().children().eq(5).text("")
            $("#list").children().eq(i).children().children().eq(6).text("")
            $("#list").children().eq(i).children().children().eq(7).text("")
            $("#list").children().eq(i).children().children().eq(8).text("")
        }
        for (let i=0;i<10;i++){
            $("#list").children().eq(i).children().children().eq(9).attr("type","hidden")
        }
        $.ajax({
            "url":"/equ/showEquHistory?page="+pagenumber,
            "type":"get",
            "dataType":"json",
            "success":function(json) {
                console.log(json.data)

                if (json.data.length<10){
                    $("#pagedpwn").attr("disabled",true)
                }else{
                    $("#pagedpwn").attr("disabled",false)
                }
                if($("#page").text()*1>1){
                    $("#pageup").attr("disabled",false)
                }else if ($("#page").text()*1==1){
                    $("#pageup").attr("disabled",true)
                }
                if($("#page").text()*1==1){
                    $("#pageup").attr("disabled",true)
                }
                $("caption").text("历史器材表工表")
                $("th:eq(0)").children().text("记录编号")
                $("th:eq(1)").children().text("器材名")
                $("th:eq(2)").children().text("器材数量")
                $("th:eq(3)").children().text("计量单位")
                $("th:eq(4)").children().text("器材价格")
                $("th:eq(5)").children().text("器材供应商")
                $("th:eq(6)").children().text("供应商电话")
                $("th:eq(7)").children().text("供应商地址")
                $("th:eq(8)").children().text("供应商邮箱")
                console.log(json.data)
                var list=json.data
                for (let i=0;i<list.length;i++){
                    var id=list[i].id
                    var ename=list[i].ename
                    var enumber=list[i].enumber
                    var unit=list[i].unit
                    var price=list[i].price
                    var sup=list[i].sup
                    var phone=list[i].phone
                    var address=list[i].address
                    var email=list[i].email
                    $("#list").children().eq(i).children().children().eq(0).text(id)
                    $("#list").children().eq(i).children().children().eq(1).text(ename)
                    $("#list").children().eq(i).children().children().eq(2).text(enumber)
                    $("#list").children().eq(i).children().children().eq(3).text(unit)
                    $("#list").children().eq(i).children().children().eq(4).text(price)
                    $("#list").children().eq(i).children().children().eq(5).text(sup)
                    $("#list").children().eq(i).children().children().eq(6).text(phone)
                    $("#list").children().eq(i).children().children().eq(7).text(address)
                    $("#list").children().eq(i).children().children().eq(8).text(email)
                    $("#list").children().eq(i).children().children().eq(9).attr("type","button")
                }
            }
        });
    }

    //获取那条记录
    function getnotes(id){
        console.log(id)
        $.ajax({
            "url":"/equ/postNotes",
            "data":{
                key:"equ",
                id:id
            },
            "type":"post",
            "dataType":"json",
            "success":function(json) {
                console.log(json.data)
                if (json.state==2000){
                    window.location.href="equchange.html"
                }else{
                    alert("获取信息失败，请练习管理员")
                }
            }
        });
    }
    function getnotesemp(id){

        console.log(id)
        $.ajax({
            "url":"/equ/postNotes",
            "data":{
              key:"emp",
              id:id
            },
            "type":"post",
            "dataType":"json",
            "success":function(json) {
                console.log(json.data)
                if (json.state==2000){
                    window.location.href="empchange.html"
                }else{
                    alert("获取信息失败，请练习管理员")
                }
            }
        });
    }



    $("#allequ").bind('click',function (){
        pagenumber=0
        $("#page").text("1")
        if ($("#page").text()*1==1){
            $("#pageup").attr("disabled",true)
        }
        showEquHistory(0);
    })
    $("#allemp").bind('click',function (){
        pagenumber=0
        $("#page").text("1")
        if ($("#page").text()*1==1){
            $("#pageup").attr("disabled",true)
        }
        showAllEmp(0);
    })
    $("#btn-addEqu").bind('click',function (){
       window.location.href="addEqu.html"
    })
    $("#btn-addEmp").bind('click',function (){
       window.location.href="addEmp.html"
    })

    function showAllEmp(pagenumber){
        console.log("正在加载.........");
        for (let i=0;i<10;i++){
            $("#list").children().eq(i).children().children().eq(0).text("")
            $("#list").children().eq(i).children().children().eq(1).text("")
            $("#list").children().eq(i).children().children().eq(2).text("")
            $("#list").children().eq(i).children().children().eq(3).text("")
            $("#list").children().eq(i).children().children().eq(4).text("")
            $("#list").children().eq(i).children().children().eq(5).text("")
            $("#list").children().eq(i).children().children().eq(6).text("")
            $("#list").children().eq(i).children().children().eq(7).text("")
            $("#list").children().eq(i).children().children().eq(8).text("")
            $("#list").children().eq(i).children().children().eq(9).attr("type","hidden")
        }

        $.ajax({
            "url":"/users/showallemp?page="+pagenumber,
            "type":"get",
            "dataType":"json",
            "success":function(json) {
                if (json.data.length<10){
                    $("#pagedpwn").attr("disabled",true)
                }else{
                    $("#pagedpwn").attr("disabled",false)
                }
                if($("#page").text()*1>1){
                    $("#pageup").attr("disabled",false)
                }else if ($("#page").text()*1==1){
                    $("#pageup").attr("disabled",true)
                }
                $("caption").text("员工表")
                $("th:eq(0)").children().text("记录编号")
                $("th:eq(1)").children().text("员工姓名")
                $("th:eq(2)").children().text("员工工号")
                $("th:eq(3)").children().text("电话")
                $("th:eq(4)").children().text("邮箱")
                $("th:eq(5)").children().text("性别")
                $("th:eq(6)").children().text("年龄")
                $("th:eq(7)").children().text("")
                $("th:eq(8)").children().text("")


                console.log(json.data)
                var list=json.data
                for (let i=0;i<list.length;i++){
                    var username=list[i].username
                    var num=list[i].num
                    var id=list[i].id
                    var phone=list[i].phone
                    var sex=list[i].sex
                    var age=list[i].age
                    var email=list[i].email
                    console.log(username)
                    console.log(num)
                    console.log(phone)
                    console.log(sex)
                    console.log(age)
                    console.log(email)
                    $("#list").children().eq(i).children().children().eq(0).text("00"+id)
                    $("#list").children().eq(i).children().children().eq(1).text(username)
                    $("#list").children().eq(i).children().children().eq(2).text(num)
                    $("#list").children().eq(i).children().children().eq(3).text(phone)
                    $("#list").children().eq(i).children().children().eq(4).text(email)
                    $("#list").children().eq(i).children().children().eq(5).text(sex)
                    $("#list").children().eq(i).children().children().eq(6).text(age)
                    $("#list").children().eq(i).children().children().eq(9).attr("type","button")
                }
            }
        });
    }




    /*<td> <input type="button" value="修改" id="btn1">  </td>*/
    $("#btn1").click(function () {
        var id=$("#id1").text()
        var idd=id.slice(0,2)
        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)
            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })

    $("#btn2").click(function () {
        var id=$("#id2").text()
        var idd=id.slice(0,2)

        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn3").click(function () {
        var id=$("#id3").text()
        var idd=id.slice(0,2)
        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)
            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn4").click(function () {
        var id=$("#id4").text()
        var idd=id.slice(0,2)

        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn5").click(function () {
        var id=$("#id5").text()
        var idd=id.slice(0,2)
        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn6").click(function () {
        var id=$("#id6").text()
        var idd=id.slice(0,2)

        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn7").click(function () {
        var id=$("#id7").text()
        var idd=id.slice(0,2)

        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn8").click(function () {
        var id=$("#id8").text()
        var idd=id.slice(0,2)
        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn9").click(function () {
        var id=$("#id9").text()
        var idd=id.slice(0,2)

        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)
            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })
    $("#btn10").click(function () {
        var id=$("#id10").text()
        var idd=id.slice(0,2)
        if (idd=="00"){
            console.log("这是员工表")
            var empid=id.slice(2)

            getnotesemp(empid)
        }else{
            console.log("这是器材表")
            getnotes(id)
        }
    })

</script>
</body>
</html>